<template>
	<div class="series">
		<x-header :left-options="{backText: ''}" @on-click-back="isSideBarShow = false">{{brandList ? brandList.s_name: ''}}</x-header>
		<template v-if="brandList">
			<h5 class="lhh40 pl10 fs14 c333  pl10 pr10 bg_agray">{{brandList.s_name}}</h5>
			<div class="list">
				<div @click="jump($event,item.id)" :to="{path:'/detail/config',query:{id:truck_info_id,compare_id:truck_info_id+ '_' + item.id}}" class="list-item flex" v-for="(item,index) in brandInfo" v-if="item.id != truck_info_id">
					<img :src="item.logo" class="car-image  mr10">
					<div class="flex-item">
						<p class="typo_black0 fs12">{{item.name}}</p>
						<p class="c_999 fs10 lh18">{{item.tags}}</p>
						<span data-type="1"  class="ask_button fr fs12">询底价</span>
					</div>
				</div>
			</div>
		</template>
		<template v-else>
			<div class="no-data">
				<img src="../../images/nodata.png">
				<div class="c_999 mt15">暂无数据</div>
			</div>
		</template>
	</div>
</template>

<script>
	import { XHeader } from 'vux'
	import { mapActions, mapGetters } from 'vuex'
	export default {
		components:{
			XHeader
		},
		data () {
			return {
				truck_info_id:'',
				linkType:'',
				brandList: '',
				brandInfo: []
			}
		},
		computed:{
		},
		methods:{
			...mapActions('brand',[
				'getListTruckByBrand'
			]),
			jump (e,id) {	
				if(e.target.dataset.type) {
					this.$router.push({path:'/ask/askprice',query:{id}})
					return
				}			
				if(!this.linkType) {

					var query = {
						id:this.truck_info_id
					}
					if(!this.compare_id) {
						query.compare_id = this.truck_info_id + id
					}else {
						if(!this.compare_id[0]) {
							query.compare_id =id + '_' + this.truck_info_id
						}else {
							query.compare_id =this.truck_info_id + '_' + id
						}
					}
					this.$router.push({path:'/detail/config',query:query})
				}else if(this.linkType == 1){
					this.$router.push({path:'/detail/descript',query:{id}})
				}
				
			}
		},
		mounted() {
			var brandid = this.$route.query.brandid;
			var series_id = this.$route.query.series_id;
			this.linkType = this.$route.query.linkType;
			var compare_id = this.$route.query.compare_id;
			if(compare_id) {
				this.compare_id = compare_id.split('_');
			}
			this.truck_info_id = this.$route.query.truck_info_id;
			this.getListTruckByBrand({brandid,series_id}).then(data => {
				if (data) {
					this.brandList = data
					this.brandInfo = data.infos
				}
			})
		}
	}
</script>

<style lang = 'scss' scoped>
	.list-item {
		height: 2.13333rem;
		border-bottom: 1px solid #f5f5f5;
		justify-content: center;
		align-items: center;
		padding-right: 0.26667rem;
		padding-left: 0.26667rem;
	}
	.ask_button {
		color: #f89f41;
		border-color: #f89f41;
	}
	.series {
		background-color: #fff;
    height: 100%;
	}
	.no-data {
		display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
	}
</style>